.login-screen
  .sidebar
    h4 Saved connections
    ul.connections
    button.add-connection.native-look(exec="addNewConnection") Add

  .main-window
    .middle-window
      .header-tabs
        != link_to("Standard", '#', {exec: 'showStandardPane', class: 'login-with-password selected'})
        != link_to("Connect URL", '#', {exec: 'showUrlPane', class: 'enter-postgres-url'})
        != link_to("Heroku", '#', {exec: 'showHerokuPane', class: 'login-with-heroku'})

      form.middle-window-content.standard
        p
          label(for="login_host") Host
          input#login_host(name='host', type='text', value='localhost', placeholder='localhost')
        p
          label(for="login_port") Port
          input#login_port(name='port', type='text', value='5432', placeholder='5432')
        p
          label(for="login_username") Username
          input#login_username(name='user', type='text', value='')
        p
          label(for="login_password") Password
          input#login_password(name='password', type='password', value='')

        p
          label(for="login_database") Database
          input#login_database(name='database', type='text', value='')

        .extra-login-fields
          p
            label
            label
              != link_to("Show tunnel optiolds", '#', {exec: 'showExtraLogingFields', class: 'open-extra-fields'})
              != link_to("Hide tunnel optiolds", '#', {exec: 'showExtraLogingFields', class: 'close-extra-fields'})
          p.extra-field
            label(for="login_query") Start Query
            input#login_query(name='sql_query', type='text', value='')
            small.help-icon(data-tooltip="This query will run every time you connect to database.\nExample:\nSET timezone = '+02'") ?
          p.extra-field
            label(for="ssh_host") SSH Host
            input#ssh_host(name='ssh_host', type='text', value='')
          p.extra-field
            label(for="ssh_port") SSH Port
            input#ssh_port(name='ssh_port', type='text', value='' placeholder='22')
          p.extra-field
            label(for="ssh_user") SSH User
            input#ssh_user(name='ssh_user', type='text', value='' placeholder=`${process.env.USER || ''}`)
          p.extra-field
            label(for="ssh_pass") SSH Password
            input#ssh_user(name='ssh_user', type='text', value='' placeholder=`***`)
          p.extra-field
            label(for="ssh_key") SSH Key
            input#ssh_key(name='ssh_key', type='text', value=''  placeholder='key.pem')

        p
          label
          label
            input(name='auto_connect', type='checkbox', value='1')
            = "Connect on start"

        input(name="query", type="hidden")

        p.buttons
          button.native-look(exec="std_testConnection") Test Connection
          button.native-look(exec="std_saveAndConnect") Save & Connect
          input.native-look(type="submit", value="Connect", autofocus=true)

      form.middle-window-content.postgres-url
        textarea.connection-url(name='connect_url' placeholder=`postgres://${process.env.USER || 'user'}@localhost/${process.env.USER || 'dbname'}`)
          = `postgres://${process.env.USER || 'user'}@localhost/${process.env.USER || 'dbname'}`

        .ssh-tunnel-info
          = "SHH Tunnel"
          small.help-icon(data-tooltip="Example:\n postgres://remote.com? ssh_host=remote.com &ssh_user=optional &ssh_pass=optional &ssh_port=optional &ssh_key=optional") ?

        p
          label
          label
            input(name='auto_connect', type='checkbox', value='1')
            = "Connect on start"

        p.buttons
          button.native-look(exec="url_testConnection") Test Connection
          button.native-look(exec="url_saveAndConnect") Save & Connect
          input.native-look(type="submit", value="Connect", autofocus=true)

      .middle-window-content.heroku-1
        h5 Connect to Heroku PostgreSQL

        p!= link_to("Access with OAuth", '#', {exec: 'startHerokuOAuth'})
        - //p!= link_to('Access with "$ heroku" command line tool', '#')


      .middle-window-content.heroku-oauth
        ul.steps
          li.access-token Grand access
          li.request-token Request Token
          li.get-apps Get applications list
        ul.apps
        ul.steps
          li.database-url Database URL
          li.connect-db Connect to DB

      .middle-window-content.heroku-cl
        ul
          li Detect command line utilite
          li Get applications list

    //- footer
    //-   a.go-to-help Get Postgres
